<style lang="less">
	.home {
		min-height: 100%;
		background: #f2f2f2;
		.handle-bar {
			top: auto;
			height: 96rpx;
			background: #fff;
			.add-btn {
				position: absolute;
				top: -16rpx;
				left: 50%;
				transform: translateX(-50%);
				width: 112rpx;
				height: 112rpx;
				background: #fff;
				border-radius: 50%;
				&::before {
					content: '';
					position: absolute;
					top: 8rpx;
					width: 96rpx;
					height: 96rpx;
					left: 50%;
					transform: translateX(-50%);
					background: linear-gradient(29deg,#e02a4e -13%, #ff597a 87%);
					border-radius: 50%;
					box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(255, 74, 134 ,0.2);
				}
				.add-icon {
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
					width: 38rpx;
					height: 38rpx;
					&::before,
					&::after {
						content: '';
						position: absolute;
						top: 50%;
						left: 50%;
						transform: translate(-50%, -50%);
						width: 100%;
						height: 0;
						background: #fff;
						border: 2rpx solid #ffffff;
						border-radius: 4rpx;
					}
					&::after {
						transform: translate(-50%, -50%) rotate(90deg);
					}
				}
			}
		}
	}
</style>

<template>
	<view class="home">
		<!-- 底部操作栏 -->
		<view class="handle-bar fixed-view" :class="isIphoneX ? 'iphoneX-bottom' : ''">
			<view class="add-btn" @click="uploadImage">
				<view class="add-icon"></view>
			</view>
		</view>
	</view>
</template>
<script>
import { createNamespacedHelpers } from 'vuex'
import systemMixin from '@/mixin/system'
import { funcSync } from '@/utils/index'
const { mapMutations } = createNamespacedHelpers('app')
/**
 * 首页
 */
export default {
	name: 'Home',
	mixins: [systemMixin],
	methods: {
		...mapMutations(['setOriginUrl', 'setLocalUrl']),
		// 上传图片
		async uploadImage() {
			const { tempFilePaths, errMsg } = await funcSync(uni.chooseImage, { count: 1 })
			// 取消选择图片
			if (errMsg === 'chooseImage:fail cancel') {
				console.error(errMsg)
				return
			}
			this.setOriginUrl(tempFilePaths[0])
			this.setLocalUrl(tempFilePaths[0])
			// 去编辑页
			uni.navigateTo({ url: '/pages/edit' })
		},
	}
}
</script>